<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>五指山污水处理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/css/public.css" media="all">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/css/logincss/layout.css" media="all">
    <link rel="shortcut icon" href="<%=request.getContextPath()%>/huazhi/images/favicon.ico"/>
</head>
<style>
    /* 底部固定区域 */
    .layui-layout-admin .layui-footer {
        padding: 10px 0;
        text-align: center;
    }

    .layui-layout-admin .layui-footer {
        background-color: #fff;
    }

    .el-input__suffix {
        position: absolute;
        height: 100%;
        right: 5px;
        top: 0;
        text-align: center;
        color: #c0c4cc;
        transition: all .3s;
        pointer-events: none;
    }

</style>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form" lay-filter="component-form-element" id="form" method="post" enctype="multipart/form-data">
                <input type="hidden" name="tid">
                <div class="layui-tab layui-tab-brief">
                    <ul class="layui-tab-title">
                        <li class="layui-this">基本信息</li>
                        <li>文件信息</li>
                    </ul>
                    <div class="layui-tab-content" style="height: auto">
                        <div class="layui-tab-item layui-show" id="onecontent">
                            <div class="layui-form-item">
                                <div class="layui-col-lg6">
                                    <div class="layui-col-xs11">
                                        <label class="layui-form-label">档案名称</label>
                                        <div class="layui-input-block">
                                            <input type="text" name="name" lay-verify="name"
                                                   autocomplete="off" placeholder="请输入档案名称"
                                                   class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-col-xs1">
                                        <div class="layui-form-mid layui-word-aux"
                                             style="color: red !important;padding: 10px !important;">*
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-col-lg6">
                                    <div class="layui-col-xs11">
                                        <label class="layui-form-label">关键描述</label>
                                        <div class="layui-input-block">
                                   <textarea class="layui-textarea" name="keyword"
                                             placeholder="请输入关键描述"></textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-col-lg6">
                                    <div class="layui-col-xs3" id="file">
                                        <label class="layui-form-label">档案文件</label>
                                        <span class="layui-btn layui-btn-primary">选择文件
                                            <input lay-verify="file" type="file" id="changefile" class="uploadImg" name="uploadFile" multiple="multiple">
                                        </span>
                                        <input type="hidden" name="filepath" id="filepath">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-col-lg6">
                                    <div class="layui-col-xs11">
                                        <label class="layui-form-label">是否鉴定</label>
                                        <div class="layui-input-block">
                                            <select name="check" class="layui-input">
                                                <option value="已鉴定">已鉴定</option>
                                                <option value="未鉴定" selected>未鉴定</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="layui-tab-item">
                            <table class="layui-hide" id="files" lay-filter="filesTables"></table>
                            <div id="laypage"></div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item layui-layout-admin">
                    <div class="layui-footer" style="left: 0;padding: 0px;">
                        <button class="layui-btn" lay-submit lay-filter="*" id="pushButton">立即提交</button>
                    </div>
                </div>
                <input type="hidden" id="username" value="${user.name}">
                <input type="hidden" id="datetime">
                <input type="hidden" id="fileupdate" value="0">
                <input type="hidden" id="filetid">
                <input type="hidden" id="filetype" value="dossier">
            </form>
        </div>
    </div>
</div>
<script src="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/layui.all.js"></script>
<script src="<%=request.getContextPath()%>/huazhi/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script src="<%=request.getContextPath()%>/huazhi/lib/jquery-3.4.1/jquery-3.4.1.min.js"></script>
<input type="hidden" id="curnum" value="1">
<script type="text/html" id="table-files">
    {{#  if($("#fileupdate").val() == '0'){ }}
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="info">下载</a>
    {{#  } }}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script>
    function child(tid){
        $("#filetid").val(tid);
        layui.use(['form', 'layer','table','laypage','laydate','files'], function () {
            var $ = layui.$
                , form = layui.form
                , laydate = layui.laydate
                , laypage = layui.laypage
                , layer = layui.layer
                , table = layui.table;
            laydate.render({
                elem:'#datetime',
                type:'datetime',
                value:new Date(),
            });
            $.ajax({
                type: "get",
                url: "<%=request.getContextPath()%>/rest/base/getDossierByTid",
                dataType: "json",
                async: false,
                data: "tid=" + tid,
                success: function (data) {
                    initfiles(data.files)
                    form.val("component-form-element", data);
                    // var pNode = document.getElementById("file");
                    // var filename = "";
                    // var files = data.files;
                    // if(files !== ""){
                    //     var path = files.split(",");
                    //     for(var i = 0; i < path.length; i++){
                    //         filename = filename + path[i].substring(path[i].indexOf("_") + 1,path[i].lastIndexOf(".") - 3) + path[i].substring(path[i].lastIndexOf(".")) + ",";
                    //     }
                    //     filename = filename.substring(0,filename.length - 1);
                    // }
                    // $("<div class='layui-input-inline' style='width: 68%'><div class='layui-input fileclass'>"+filename+"</div></div>").insertAfter(pNode.children[0]);
                }
            })
            // var files = [];
            //第一种方法添加用户
            form.on('submit(*)', function (data) {
                var field = data.field//当前容器的全部表单字段，名值对形式：{name: value}
                var formData = getFormData();
                // var formData = new FormData();
                // formData.append("tid",field.tid);
                // formData.append("name",field.name);
                // formData.append("check",field.check);
                // formData.append("keyword",field.keyword);
                // formData.append("filepath",field.filepath);
                // formData.set("uploadFile","");
                // for(var i = 0; i < files.length; i++){
                //     formData.append("uploadFile",files[i]);
                // }
                var index = layer.msg('数据提交中，请稍候', {icon: 16, time: false, shade: 0.6});
                $("#pushButton").addClass("layui-btn layui-btn-disabled").prop("disabled", true);
                $.ajax({
                    type: "post",
                    url: "<%=request.getContextPath()%>/rest/base/updateDossier",
                    data: formData,
                    processData: false,			//对数据不做处理
                    dataType: "json",
                    cache: false,      			//上传文件不需要缓存
                    contentType: false,
                    success: function (obj) {
                        setTimeout(function () {
                            layer.close(index);
                            if (obj === true) {
                                layer.msg('修改成功');
                            } else {
                                layer.msg(obj.errorMsg);
                            }
                        }, 2000);
                        setTimeout(function () {
                            var indexs = parent.layer.getFrameIndex(window.name);//获取当前弹出层的层级
                            parent.layer.close(indexs);//关闭弹出层
                        }, 4000);
                    }
                })
                return false;
            });
            <%--var cols = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},--%>
            <%--    {field: 'filename', title: '文件名', sort: true},--%>
            <%--    {field: 'filetype', title: '文件类型', sort: true},--%>
            <%--    {field: 'filesize', title: '文件大小', sort: true},--%>
            <%--    {field: 'uploadtime', title: '上传时间', sort: true},--%>
            <%--    {field: 'uploaduser', title: '操作人', sort: true},--%>
            <%--    {title: '操作', toolbar: '#table-files', align: "center", width: 200, fixed: "right"}]--%>
            <%--var limitcount = 10;--%>
            <%--table.render({--%>
            <%--    elem: '#files'--%>
            <%--    , url: "<%=request.getContextPath()%>/rest/base/getFilesListByTid"--%>
            <%--    , title: "用户列表"--%>
            <%--    , height: 'full-220'--%>
            <%--    , page: false--%>
            <%--    , limit: limitcount--%>
            <%--    , text: {--%>
            <%--        none: '暂无相关数据' //默认：无数据。注：该属性为 layui 2.2.5 开始新增--%>
            <%--    },--%>
            <%--    toolbar: '#filesOperation',--%>
            <%--    defaultToolbar: ['filter']--%>
            <%--    // ,skin: 'line' //表格风格--%>
            <%--    , cols: [cols],--%>
            <%--    where: {tid: tid,type:"dossier"},--%>
            <%--    done: function (res, curr, count) {--%>
            <%--        $('.layui-table-fixed-r').removeClass('layui-hide');//列固定右侧--%>
            <%--        var curnum = $("#curnum").val();--%>
            <%--        laypage.render({--%>
            <%--            elem: 'laypage'--%>
            <%--            , first: '首页'--%>
            <%--            , last: '尾页'--%>
            <%--            , groups: 5--%>
            <%--            , count: count--%>
            <%--            , curr: curnum--%>
            <%--            , limit: limitcount--%>
            <%--            , layout: ['prev', 'page', 'next', 'skip', 'count', 'limit']--%>
            <%--            , limits: [10, 15, 20]--%>
            <%--            , jump: function (obj, first) {--%>
            <%--                if (!first) {--%>
            <%--                    curnum = obj.curr;--%>
            <%--                    $("#curnum").val(curnum)--%>
            <%--                    limitcount = obj.limit;--%>
            <%--                    table.reload('files', { //表格的id--%>
            <%--                        where: {--%>
            <%--                            page: curnum,--%>
            <%--                            limit: limitcount--%>
            <%--                        }--%>
            <%--                    })--%>
            <%--                }--%>
            <%--            }--%>
            <%--        })--%>
            <%--    }--%>
            <%--});--%>
            <%--//监听工具条--%>
            <%--table.on('tool(filesTables)', function (obj) {  //表格的lay-filter="userlists"--%>
            <%--    var data = obj.data; //获得当前行所有数据--%>
            <%--    if (obj.event === 'info') {--%>
            <%--        info(data);--%>
            <%--    } else if (obj.event === 'del') {--%>
            <%--        del(data,obj);--%>
            <%--    }--%>
            <%--});--%>
            <%--function getSize(length) {--%>
            <%--    if(length > 1024){--%>
            <%--        length = length / 1024;--%>
            <%--        if(length > 1024){--%>
            <%--            length = length / 1024;--%>
            <%--            if(length > 1024){--%>
            <%--                length = length / 1024;--%>
            <%--                return Math.ceil(length) + "GB";--%>
            <%--            }else {--%>
            <%--                return Math.ceil(length) + "MB";--%>
            <%--            }--%>
            <%--        }else {--%>
            <%--            return Math.ceil(length) + "KB";--%>
            <%--        }--%>
            <%--    }else {--%>
            <%--        return Math.ceil(length) + "B";--%>
            <%--    }--%>
            <%--}--%>
            <%--function info(data) {--%>
            <%--    &lt;%&ndash;$.ajax({&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    type: "post",&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    url: "<%=request.getContextPath()%>/rest/files/getShowdPath",&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    dataType: "json",&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    async: false,&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    data: "tid=" + data.tid,&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    success: function (msg) {&ndash;%&gt;--%>
            <%--    &lt;%&ndash;        window.open(msg.showdpath)&ndash;%&gt;--%>
            <%--    &lt;%&ndash;    }&ndash;%&gt;--%>
            <%--    &lt;%&ndash;})&ndash;%&gt;--%>
            <%--    window.open("<%=request.getContextPath()%>/rest/base/downloadFile?filepath="+data.filepath);--%>

            <%--}--%>
            <%--function del(data,obj){--%>
            <%--    layer.confirm('确定删除此文件', {icon: 3, title: '提示信息', shade: 0.6}, function (index) {--%>
            <%--        layer.close(index);--%>
            <%--        layer.msg('删除中，请稍候', {icon: 16, time: false, shade: 0.6});--%>
            <%--        setTimeout(function () {--%>
            <%--            var pNode = document.getElementById("changefile");--%>
            <%--            if(pNode.files.length > 0){--%>
            <%--                var index = 0;--%>
            <%--                for(var i = 0; i < pNode.files.length; i++){--%>
            <%--                    const file = pNode.files[i];--%>
            <%--                    files[i] = file;--%>
            <%--                    if(data.filepath === file.name){--%>
            <%--                        index = i;--%>
            <%--                    }//else {--%>
            <%--                    //     name = name + file.name+ ",";--%>
            <%--                    // }--%>
            <%--                }--%>
            <%--                //name = name.substring(0,name.length-1);--%>
            <%--                files.splice(index,1);--%>
            <%--                //document.getElementById("filetext").innerText = name;--%>
            <%--            }else {--%>
            <%--                $("#filepath").val(data.filepath);--%>
            <%--                &lt;%&ndash;$.ajax({&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    type: "post",&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    url: "<%=request.getContextPath()%>/rest/base/delDossierFile",&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    dataType: "json",&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    async: false,&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    data: "tid=" + tid + "&filepath=" + data.filepath,&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    success: function (msg) {&ndash;%&gt;--%>
            <%--                &lt;%&ndash;        layer.close(index);&ndash;%&gt;--%>
            <%--                &lt;%&ndash;        if (msg === true) {&ndash;%&gt;--%>
            <%--                &lt;%&ndash;            layer.msg('删除成功');&ndash;%&gt;--%>
            <%--                &lt;%&ndash;            obj.del();&ndash;%&gt;--%>
            <%--                &lt;%&ndash;        } else {&ndash;%&gt;--%>
            <%--                &lt;%&ndash;            layer.msg(msg.errorMsg);&ndash;%&gt;--%>
            <%--                &lt;%&ndash;        }&ndash;%&gt;--%>
            <%--                &lt;%&ndash;    }&ndash;%&gt;--%>
            <%--                &lt;%&ndash;})&ndash;%&gt;--%>
            <%--            }--%>
            <%--            layer.msg('删除成功');--%>
            <%--            obj.del();--%>
            <%--        }, 2000);--%>
            <%--    });--%>
            <%--}--%>
            <%--function inittable(files){--%>
            <%--    var data = [];--%>
            <%--    for(var i = 0; i < files.length; i++){--%>
            <%--        var file = files[i];--%>
            <%--        var json = {--%>
            <%--            "filename":file.name.substring(0,file.name.lastIndexOf(".")),--%>
            <%--            "filetype":file.name.substring(file.name.lastIndexOf(".") + 1),--%>
            <%--            "filesize":getSize(file.size),--%>
            <%--            "uploadtime":$("#datetime").val(),--%>
            <%--            "uploaduser":$("#username").val(),--%>
            <%--            "filepath":file.name--%>
            <%--        };--%>
            <%--        data.push(json);--%>
            <%--    }--%>
            <%--    table.reload('files', { //表格的id--%>
            <%--        data:data,--%>
            <%--        url:null,--%>
            <%--        cols: [cols],--%>
            <%--    })--%>
            <%--}--%>
            <%--$(document).on('change',"#changefile",function () {--%>
            <%--    var fileData = this.files;--%>
            <%--    //var name = "";--%>
            <%--    var size = 0;--%>
            <%--    //var pNode = this.parentNode.parentNode;--%>
            <%--    if(fileData.length > 10){--%>
            <%--        layer.msg("上传文件过多，最多只能上传10个文件", {icon: 5, anim: 6});--%>
            <%--        this.value = null;--%>
            <%--    }else if(fileData.length > 0){--%>
            <%--        for(var i = 0;i<fileData.length;i++){--%>
            <%--            //name = name + fileData[i].name + ",";--%>
            <%--            size = size + fileData[i].size;--%>
            <%--            files[i] = fileData[i];--%>
            <%--        }--%>
            <%--        if(size >= 10485760000){--%>
            <%--            layer.msg("文件过大，请选择小于9G的文件", {icon: 5, anim: 6});--%>
            <%--            this.value = null;--%>
            <%--            // }else {--%>
            <%--            //     for(j = pNode.children.length-2; j >= 0; j--){--%>
            <%--            //         pNode.removeChild(pNode.children[j]);--%>
            <%--            //     }--%>
            <%--            //     var fileNode = document.getElementById("files");--%>
            <%--            //     while (fileNode.children.length > 0){--%>
            <%--            //         fileNode.removeChild(fileNode.children[fileNode.children.length - 1]);--%>
            <%--            //     }--%>
            <%--            //     $("<div class='layui-col-xs6'>\n" +--%>
            <%--            //         "<label class='layui-form-label'>档案文件</label>\n" +--%>
            <%--            //         "<div class='layui-input-block'>\n" +--%>
            <%--            //         "<div class='layui-input fileclass' id='filetext'>"+name.substring(0,name.length-1)+"</div>\n" +--%>
            <%--            //         "</div>\n" +--%>
            <%--            //         "</div>").prependTo(pNode);--%>
            <%--        }else {--%>
            <%--            $("#fileupdate").val("1");--%>
            <%--            inittable(fileData);--%>
            <%--        }--%>
            <%--    }--%>
            <%--});--%>
        });
    }
</script>
</body>
</html>